import React from "react";

const ConnectionIcon = ({ width, height, fill="#ccc", primaryFill="#00B39F", secondaryFill="#00D3A9", style = {} }) => (
  <svg
    style={style}
    xmlns="http://www.w3.org/2000/svg"
    height={height}
    viewBox="0 0 18 19"
    width={width}
    fill={fill}
  >
    <g clipPath="url(#clip0_11326_34264)">
      <path
        d="M14.6169 9.82553C14.7759 10.5484 15.4121 11.0978 16.1928 11.0978C17.0747 11.0978 17.7976 10.3749 17.7976 9.493C17.7976 8.61108 17.0747 7.88818 16.1928 7.88818C15.4121 7.88818 14.7759 8.43758 14.6169 9.16047H13.1494C13.1581 9.27324 13.1639 9.38602 13.1639 9.50023C13.1639 9.61445 13.1581 9.71855 13.1494 9.82553H14.6169Z"
        fill={fill}
      />
      <path
        d="M11.6719 6.29325C11.8439 6.43783 12.0044 6.59687 12.1504 6.76892L15.4555 3.47831C15.7157 3.65181 16.0193 3.73855 16.3374 3.73855C16.7712 3.73855 17.176 3.56506 17.4796 3.26145C17.7832 2.95783 17.9567 2.55301 17.9567 2.11928C17.9567 1.68554 17.7832 1.28072 17.4796 0.977108C17.176 0.673494 16.7712 0.5 16.3374 0.5C15.9037 0.5 15.4989 0.673494 15.1952 0.977108C14.8916 1.28072 14.7181 1.68554 14.7181 2.11928C14.7181 2.43735 14.8049 2.74096 14.9784 3.0012L11.6719 6.29325ZM15.6579 1.48313C15.8459 1.29518 16.0772 1.20843 16.3374 1.20843C16.5977 1.20843 16.829 1.30964 17.0169 1.48313C17.3928 1.85904 17.3928 2.45181 17.0169 2.82771C16.829 3.01566 16.5977 3.10241 16.3374 3.10241C16.0772 3.10241 15.8459 3.0012 15.6579 2.82771C15.282 2.46627 15.282 1.85904 15.6579 1.48313Z"
        fill={fill}
      />
      <path
        d="M8.61702 3.85406V5.32298C8.73412 5.31286 8.85123 5.30707 8.97123 5.30707C9.07533 5.30707 9.17942 5.31286 9.28208 5.32009V3.85406C10.005 3.69503 10.5544 3.05888 10.5544 2.27816C10.5544 1.39623 9.83147 0.67334 8.94955 0.67334C8.06762 0.67334 7.34473 1.39623 7.34473 2.27816C7.34473 3.05888 7.89412 3.69503 8.61702 3.85406Z"
        fill={fill}
      />
      <path
        d="M1.61928 3.76755C1.93735 3.76755 2.24096 3.68081 2.5012 3.50731L5.77157 6.79213C5.91036 6.62876 6.06217 6.4755 6.2241 6.33382L2.93494 3.0302C3.10843 2.76996 3.19518 2.46635 3.19518 2.14828C3.19518 1.71454 3.02169 1.30972 2.71807 1.00611C2.45783 0.702493 2.05301 0.543457 1.61928 0.543457C1.18554 0.543457 0.780723 0.702493 0.477108 1.00611C0.173494 1.30972 0 1.71454 0 2.14828C0 2.58201 0.173494 2.98683 0.477108 3.29044C0.780723 3.59406 1.18554 3.76755 1.61928 3.76755ZM0.954217 1.4543C1.33012 1.0784 1.92289 1.0784 2.2988 1.4543C2.48675 1.64225 2.57349 1.87358 2.57349 2.13382C2.57349 2.39406 2.47229 2.63984 2.2988 2.81334C1.92289 3.18924 1.31566 3.18924 0.954217 2.81334C0.766265 2.62538 0.679518 2.39406 0.679518 2.13382C0.679518 1.87358 0.780723 1.64225 0.954217 1.4543Z"
        fill={fill}
      />
      <path
        d="M3.31061 9.20344C3.15157 8.48055 2.51542 7.93115 1.7347 7.93115C0.852774 7.93115 0.129883 8.65404 0.129883 9.53597C0.129883 10.4179 0.852774 11.1408 1.7347 11.1408C2.51542 11.1408 3.15157 10.5914 3.31061 9.8685H4.79542C4.7853 9.74706 4.77808 9.62416 4.77808 9.49983C4.77808 9.40007 4.78241 9.30175 4.78964 9.20344H3.31061Z"
        fill={fill}
      />
      <path
        d="M17.5228 15.7384C17.1469 15.4348 16.7421 15.2613 16.3083 15.2613C15.9903 15.2613 15.6866 15.3481 15.4264 15.5216L12.1503 12.231C12.01 12.3929 11.8582 12.5447 11.6963 12.6849C11.7006 12.6806 11.7064 12.6777 11.7107 12.6734L15.0216 15.9987C14.8481 16.2589 14.7613 16.5625 14.7613 16.8806C14.7613 17.3143 14.9348 17.7191 15.2385 18.0228C15.5421 18.3264 15.9469 18.4999 16.3806 18.4999C16.8144 18.4999 17.2192 18.3264 17.5228 18.0228C17.8264 17.7191 17.9999 17.3143 17.9999 16.8806C17.9999 16.4469 17.8264 16.042 17.5228 15.7384ZM16.9879 17.5457C16.612 17.9216 16.0192 17.9216 15.6433 17.5457C15.4553 17.3577 15.3686 17.1264 15.3686 16.8661C15.3686 16.6059 15.4698 16.3746 15.6433 16.1866C16.0192 15.8107 16.6264 15.8107 16.9879 16.1866C17.1758 16.3746 17.2626 16.6059 17.2626 16.8661C17.2626 17.1264 17.1613 17.3722 16.9879 17.5457Z"
        fill={fill}
      />
      <path
        d="M9.33969 15.1601V13.6753C9.21825 13.6854 9.09536 13.6926 8.97102 13.6926C8.87126 13.6926 8.77295 13.6883 8.67463 13.6811V15.1601C7.95174 15.3191 7.40234 15.9553 7.40234 16.736C7.40234 17.6179 8.12524 18.3408 9.00716 18.3408C9.88909 18.3408 10.612 17.6179 10.612 16.736C10.612 15.9553 10.0626 15.3191 9.33969 15.1601Z"
        fill={fill}
      />
      <path
        d="M6.26313 12.6996C6.09976 12.5608 5.94651 12.409 5.80482 12.2471L2.48675 15.5507C2.22651 15.3772 1.92289 15.2904 1.60482 15.2904C1.17108 15.2904 0.766265 15.4639 0.462651 15.7676C0.159036 16.0133 0 16.4182 0 16.8519C0 17.2856 0.173494 17.6904 0.477108 17.9941C0.780723 18.2977 1.18554 18.4712 1.61928 18.4712C2.05301 18.4712 2.45783 18.2977 2.76145 17.9941C3.06506 17.6904 3.23855 17.2856 3.23855 16.8519C3.23855 16.5338 3.15181 16.2302 2.97831 15.97L6.26313 12.6996ZM2.26988 17.5314C2.08193 17.7194 1.8506 17.8061 1.59036 17.8061C1.33012 17.8061 1.0988 17.7049 0.910843 17.5314C0.53494 17.1555 0.53494 16.5627 0.910843 16.1868C1.0988 15.9989 1.33012 15.9121 1.59036 15.9121C1.8506 15.9121 2.08193 16.0133 2.26988 16.1868C2.64578 16.5483 2.64578 17.1555 2.26988 17.5314Z"
        fill={fill}
      />
      <path d="M9.12207 7.32129V9.29045L10.8281 8.30298L9.12207 7.32129Z" fill={primaryFill} />
      <path d="M9.12207 9.70068V11.68L10.844 10.6954L9.12207 9.70068Z" fill={primaryFill} />
      <path
        d="M8.87574 9.27571V7.33691L7.19141 8.30414L8.87574 9.27571Z"
        fill={secondaryFill}
      />
      <path
        d="M5.49609 11.6726C5.82718 12.2047 6.27393 12.6543 6.80308 12.9883V10.9165L5.49609 11.6726Z"
        fill={secondaryFill}
      />
      <path d="M8.87617 11.67V9.71533L7.1875 10.6941L8.87617 11.67Z" fill={secondaryFill} />
      <path d="M7.0498 12.8642L8.76017 11.8869L7.0498 10.8979V12.8642Z" fill={primaryFill} />
      <path
        d="M10.9609 12.8745V10.9111L9.25195 11.8885L10.9609 12.8745Z"
        fill={secondaryFill}
      />
      <path
        d="M12.6323 11.4445C12.9244 10.8994 13.0892 10.2951 13.1152 9.67773L11.3369 10.6956L12.6323 11.4445Z"
        fill={secondaryFill}
      />
      <path d="M11.207 10.4872L12.9232 9.50556L11.207 8.51953V10.4872Z" fill={primaryFill} />
      <path d="M10.961 8.09439V6.14258L9.26074 7.11704L10.961 8.09439Z" fill={secondaryFill} />
      <path d="M10.9604 10.4784V8.50928L9.25586 9.4953L10.9604 10.4784Z" fill={secondaryFill} />
      <path d="M7.0498 8.50537V10.4904L8.76595 9.49573L7.0498 8.50537Z" fill={primaryFill} />
      <path
        d="M8.87606 5.37939C8.24425 5.39674 7.62546 5.56012 7.06738 5.85795L8.87606 6.89602V5.38084V5.37939Z"
        fill={secondaryFill}
      />
      <path d="M7.0498 6.12988V8.10338L8.7674 7.11735L7.0498 6.12988Z" fill={primaryFill} />
      <path
        d="M6.80308 6.00977C6.27393 6.34374 5.82718 6.79338 5.49609 7.32543L6.80308 8.08013V6.00977Z"
        fill={secondaryFill}
      />
      <path
        d="M10.9495 5.8666C10.3871 5.56299 9.76111 5.39672 9.12207 5.37793V6.91335L10.9495 5.8666Z"
        fill={primaryFill}
      />
      <path
        d="M4.87988 9.64453C4.90157 10.2807 5.06928 10.9024 5.37289 11.4619L6.69723 10.6956L4.87988 9.64598V9.64453Z"
        fill={primaryFill}
      />
      <path
        d="M5.37289 7.53809C5.07073 8.09471 4.90302 8.71351 4.87988 9.34676L6.69868 8.30291L5.37289 7.53809Z"
        fill={primaryFill}
      />
      <path
        d="M7.06445 13.1387C7.62397 13.4365 8.24421 13.6013 8.87747 13.6187V12.1021L7.06445 13.1387Z"
        fill={secondaryFill}
      />
      <path
        d="M12.5053 7.33277C12.1772 6.80217 11.7333 6.35398 11.207 6.01855V8.08313L12.5053 7.33277Z"
        fill={primaryFill}
      />
      <path
        d="M11.207 12.9814C11.7362 12.6446 12.1815 12.192 12.5111 11.6585L11.207 10.9053V12.9814Z"
        fill={primaryFill}
      />
      <path
        d="M13.1208 9.33527C13.0976 8.70925 12.9299 8.09623 12.6321 7.54395L11.3193 8.30154L13.1208 9.33527Z"
        fill={secondaryFill}
      />
      <path
        d="M9.12207 13.6205C9.75388 13.6031 10.3727 13.4398 10.9307 13.1419L9.12207 12.0938V13.6205Z"
        fill={primaryFill}
      />
      <path
        d="M6.80293 10.4729V8.52686L5.11426 9.49553L6.80293 10.4729Z"
        fill={secondaryFill}
      />
    </g>
    <defs>
      <clipPath id="clip0_11326_34264">
        <rect width="18" height="18" fill="white" transform="translate(0 0.5)" />
      </clipPath>
    </defs>
  </svg>
);

export default ConnectionIcon;
